<template>
	<view class="flex"  style="padding: 18rpx 0;" :class="astyle">
		<text class="px-20 font-weight-bold font text-right" :style="labelStyle">{{label}}</text>
		<text class="flex-1 font text-body" v-if="text" >{{text}}</text>
		<view class="flex flex-1" v-else>
			<slot></slot>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			label: {
				type: String,
				default: ''
			},
			text: {
				type: String,
				default: ''
			},
			labelStyle: {
				type:String,
				default: 'width:140rpx;'
			},
			labelWidth: {
				type: [String,Number],
				default: "120"
			},
			align:{
				type:String,
				default: 'align-center'
			},
			borderButtom: {
				type: Boolean,
				default:false
			}
		},
		computed: {
			astyle(){
				if(this.borderButtom){
					return `${this.align} border-bottom`
				}else{
					return `${this.align}`
				}
			}
		},
	}
</script>

<style>
</style>